<template>
  <div>
    <Card dis-hover>
      <h3>
        {{ taskName }}
      </h3>
      <ButtonGroup slot="extra">
        <Button @click="approvalInfo" type="warning" style="background: #EF5350;" :loading="buttonloading"
                v-if="approval">
          <Icon type="ios-bookmark"/>
          审批
        </Button>
        <Button @click="returnTo">
          返回
          <Icon type="ios-arrow-forward"/>
        </Button>
      </ButtonGroup>
    </Card>
    <Row>
      <i-col span="24">
        <Card dis-hover style="margin: 10px;">
          <Spin fix v-if="spinShow">
            <Icon type="ios-loading" size=18 class="demo-spin-icon-load"></Icon>
            <div>Loading</div>
          </Spin>
          <div :style="{height: bodyHeight + 'px', overflowY: 'auto', overflowX: 'hidden', }">
            <Form ref="formCustom" :model="formData" :rules="ruleCustom" label-position="top">
              <Row :gutter="16">
                <i-col span="24">
                  <FormItem label="被检查单位">
                    <Input v-model="noticeData.inspectionUnitName" type="text" readonly/>
                  </FormItem>
                </i-col>
              </Row>
              <Row :gutter="16">

                <i-col span="12">
                  <FormItem label="检查时间：" prop="inspectionDate">
                    <DatePicker type="date" placeholder="请选择" style="width: 100%;" v-if="ifEdit"
                                v-model="noticeData.inspectionDate"></DatePicker>
                    <Input v-model="noticeData.inspectionDate" type="text" readonly v-else/>
                  </FormItem>
                </i-col>
                <i-col span="12">
                  <FormItem label="检查部位：">
                    <Input v-model="noticeData.inspectionSite" placeholder="请输入检查部位" type="text" :readonly="!ifEdit"/>
                  </FormItem>
                </i-col>
              </Row>
              <Row :gutter="16">
                <i-col span="24">
                  <FormItem label="检查人员：" prop="inspectionUsers">
                    <Input v-model="noticeData.inspectionUsers" type="text" :readonly="!ifEdit"/>
                  </FormItem>
                </i-col>
              </Row>
              <Row type="flex" justify="start" class="query-form" v-if="ifEdit">
                <i-col>
                  <Button icon="md-add" class="ivu-btn-add" @click="addItemInfo">新增问题</Button>
                </i-col>
              </Row>
              <Row :gutter="16">
                <i-col span="24">
                  <Table :loading="loading1" size="small" class="table" no-data-text="没有查询到相关数据!"
                         highlight-row stripe border :columns="columns3" width="100%" :data="apsgNoticeItem">
                  </Table>
                </i-col>
              </Row>
              <Divider orientation="left" v-if="approval">操作信息</Divider>
              <Row :gutter="16">
                <i-col span="8" v-if="ifRoute">
                  <FormItem label="审批意见：" prop="route">
                    <Select filterable v-model="formData.route" @on-change="changeRoute">
                      <Option v-for="item in routeList" :value="item.id" :key="item.id">{{ item.name }}</Option>
                    </Select>
                  </FormItem>
                </i-col>
                <i-col span="8" v-if="ifCompanyLeader">
                  <FormItem label="企业负责人：" prop="dynamicAudits">
                    <Select filterable v-model="formData.dynamicAudits" filterable style="width: 80%">
                      <Option v-for="item in companyLeaderList" :value="item.userId" :key="item.userId">{{
                          item.userName
                        }}
                      </Option>
                    </Select>
                    <Button icon="ios-search" style="margin-left: 10px" @click="openUserModal()"></Button>
                  </FormItem>
                </i-col>
                <i-col span="8" v-if="ifRectificationUser">
                  <FormItem label="整改人：" prop="dynamicAudits">
                    <userDom @setUserInfo="setUserInfo" :orgId="companyName"></userDom>
                  </FormItem>
                </i-col>
<!--                <i-col span="8" v-if="ifAcceptanceUser">-->
<!--                  <FormItem label="验收人：" prop="dynamicAudits">-->
<!--                    <userDom @setUserInfo="setUserInfo" :orgId="companyId" :userName2="userName"></userDom>-->
<!--                  </FormItem>-->
<!--                </i-col>-->
              </Row>
              <Row :gutter="16" v-if="approval">
                <i-col span="8">
                  <FormItem label="操作人：">
                    <Input v-model="formData.userName" readonly/>
                  </FormItem>
                </i-col>
                <i-col span="8">
                  <FormItem label="操作时间：">
                    <Input v-model="formData.createDateStr" readonly/>
                  </FormItem>
                </i-col>
              </Row>
              <Row :gutter="16" v-if="approval">
                <i-col span="24">
                  <FormItem label="说明：" prop="opinion">
                    <Input type="textarea" v-model="formData.opinion"/>
                  </FormItem>
                </i-col>
              </Row>
            </Form>
          </div>
        </Card>
      </i-col>
    </Row>
    <Modal :transfer=false v-model="modal5" :width=800 :title="'问题详情'" @on-cancel="modal6=false">
      <div :style="{height: divHeight, overflowY: 'auto', overflowX: 'hidden'}">
        <Form class="modal-view-detail" :model="InputItemData" label-position="top">
          <Row :gutter="16">
            <i-col span='12'>
              <FormItem label="隐患归类：">
                <Select filterable v-model="InputItemData.issueCategory" disabled>
                  <Option v-for="item in categoryList" :value="item.codingCodeId" :key="item.codingCodeId">
                    {{ item.codingName }}
                  </Option>
                </Select>
              </FormItem>
            </i-col>
            <i-col span='12'>
              <FormItem label="隐患等级：">
                <Select filterable v-model="InputItemData.issueLevel" disabled>
                  <Option v-for="item in levelList" :value="item.codingCodeId" :key="item.codingCodeId">
                    {{ item.codingName }}
                  </Option>
                </Select>
              </FormItem>
            </i-col>
          </Row>
          <Row :gutter="16">
            <i-col span='12'>
              <FormItem label="隐患类别：">
                <Select v-model="InputItemData.issuePosition" v-if="ifCategory == 1" disabled>
                  <OptionGroup label="基础管理">
                    <Option v-for="item in basicList" :value="item.codingCodeId" :key="item.codingCodeId">
                      {{ item.codingName }}
                    </Option>
                  </OptionGroup>
                  <OptionGroup label="现场管理">
                    <Option v-for="item in sceneList" :value="item.codingCodeId"
                            :key="item.codingCodeId">{{ item.codingName }}
                    </Option>
                  </OptionGroup>
                </Select>
                <Select v-model="InputItemData.issuePosition" v-if="ifCategory == 2" disabled>
                  <Option v-for="item in environmentProtectionList" :value="item.codingCodeId"
                          :key="item.codingCodeId">{{ item.codingName }}
                  </Option>
                </Select>
              </FormItem>
            </i-col>
            <i-col span='12'>
              <FormItem label='检查时间：'>
                <DatePicker type="date" v-model="InputItemData.checkTime" style="width: 100%"
                            readonly></DatePicker>
              </FormItem>
            </i-col>
          </Row>
          <Row :gutter="16">
            <i-col span='12'>
              <FormItem label='完成时限：'>
                <DatePicker type="date" v-model="InputItemData.rectifyDate" style="width: 100%"
                            readonly></DatePicker>
              </FormItem>
            </i-col>
            <i-col span='12'>
              <FormItem label='整改状态：' prop='state'>
                <Select v-model="InputItemData.state" disabled>
                  <Option value="NOT_RECTIFIED">待整改</Option>
                  <Option value="START">整改中</Option>
                  <Option value="OPEN">已完成</Option>
                  <Option value="DELAY" disabled>延期</Option>
                </Select>
              </FormItem>
            </i-col>
          </Row>
          <Row :gutter="16">
            <i-col span='24'>
              <FormItem label="问题描述：">
                <Input v-model="InputItemData.itemDesc" type="textarea" readonly/>
              </FormItem>
            </i-col>
          </Row>
          <Row span='24'>
            <i-col span="24">
              <FormItem label="照片：">
                <div v-show="uploadList.length>0" v-for="item in uploadList" :key='item'
                     style="display: inline-block;margin-right: 10px">
                  <router-link target="_blank" :to="{path:'/imgDetails',query:{id:item.id}}">
                    <img :src="item.picture" alt="" style="width: 50px;height: 50px;">
                  </router-link>
                  <br>
                  <a @click="downloadFile(InputItemData, item)">{{ item.fileName }}</a>
                </div>
              </FormItem>
            </i-col>
          </Row>
          <Row :gutter="16">
            <i-col span='24'>
              <FormItem label='整改措施：'>
                <Input v-model="InputItemData.itemMeasures" type="textarea" readonly/>
              </FormItem>
            </i-col>
          </Row>
          <Row :gutter="16">
            <i-col span='24'>
              <FormItem label='当前进展描述：'>
                <Input v-model="InputItemData.completion" type="textarea" readonly/>
              </FormItem>
            </i-col>
          </Row>
          <Row :gutter="16">
            <i-col span='24'>
              <FormItem label='整改图片：'>
                <div v-show="uploadList2.length>0" v-for="item in uploadList2" :key='item'
                     style="display: inline-block;margin-right: 10px">
                  <router-link target="_blank" :to="{path:'/imgDetails',query:{id:item.id}}">
                    <img :src="item.picture" alt="" style="width: 50px;height: 50px;">
                  </router-link>
                  <br>
                  <a @click="downloadFile(InputItemData, item)">{{ item.fileName }}</a>
                </div>
              </FormItem>
            </i-col>
          </Row>
          <Row :gutter="16">
            <i-col span='24'>
              <FormItem label="整改附件：">
                <div v-show="InputItemData.idFiles.length>0" v-for="(item,index) in InputItemData.idFiles">
                  <a @click="downloadFiles(item,index)"><span
                      style="color: #3399ff;margin-left: 5px">{{ item.fileName }}</span></a>
                  <Progress v-show="uploadListVisible[index]" :percent="uploadListPercent[index]"></Progress>
                </div>
              </FormItem>
            </i-col>
          </Row>
        </Form>
      </div>
      <div slot="footer">
        <Button class='ivu-btn-save' @click="modal6=false">关闭</Button>
      </div>
    </Modal>
    <Modal :transfer=false v-model="modal6" :width=800 :title="'问题详情'" @on-cancel="modal6=false">
      <div :style="{height: divHeight, overflowY: 'auto', overflowX: 'hidden'}">
        <Form class="modal-view-detail" :model="InputItemData" label-position="top">
          <Row :gutter="16">
            <i-col span='12'>
              <FormItem label="隐患归类：">
                <Select filterable v-model="InputItemData.issueCategory" disabled>
                  <Option v-for="item in categoryList" :value="item.codingCodeId" :key="item.codingCodeId">
                    {{ item.codingName }}
                  </Option>
                </Select>
              </FormItem>
            </i-col>
            <i-col span='12'>
              <FormItem label="隐患等级：">
                <Select filterable v-model="InputItemData.issueLevel" disabled>
                  <Option v-for="item in levelList" :value="item.codingCodeId" :key="item.codingCodeId">
                    {{ item.codingName }}
                  </Option>
                </Select>
              </FormItem>
            </i-col>
          </Row>
          <Row :gutter="16">
            <i-col span='12'>
              <FormItem label="隐患类别：">
                <Select v-model="InputItemData.issuePosition" v-if="ifCategory == 1" disabled>
                  <OptionGroup label="基础管理">
                    <Option v-for="item in basicList" :value="item.codingCodeId" :key="item.codingCodeId">
                      {{ item.codingName }}
                    </Option>
                  </OptionGroup>
                  <OptionGroup label="现场管理">
                    <Option v-for="item in sceneList" :value="item.codingCodeId"
                            :key="item.codingCodeId">{{ item.codingName }}
                    </Option>
                  </OptionGroup>
                </Select>
                <Select v-model="InputItemData.issuePosition" v-if="ifCategory == 2" disabled>
                  <Option v-for="item in environmentProtectionList" :value="item.codingCodeId"
                          :key="item.codingCodeId">{{ item.codingName }}
                  </Option>
                </Select>
              </FormItem>
            </i-col>
            <i-col span='12'>
              <FormItem label='检查时间：'>
                <DatePicker type="date" v-model="InputItemData.checkTime" style="width: 100%"
                            readonly></DatePicker>
              </FormItem>
            </i-col>
          </Row>
          <Row :gutter="16">
            <i-col span='12'>
              <FormItem label='完成时限：'>
                <DatePicker type="date" v-model="InputItemData.rectifyDate" style="width: 100%"
                            readonly></DatePicker>
              </FormItem>
            </i-col>
            <i-col span='12'>
              <FormItem label='整改状态：' prop='state'>
                <Select v-model="InputItemData.state" disabled>
                  <Option value="NOT_RECTIFIED">待整改</Option>
                  <Option value="START">整改中</Option>
                  <Option value="OPEN">已完成</Option>
                  <Option value="DELAY" disabled>延期</Option>
                </Select>
              </FormItem>
            </i-col>
          </Row>
          <Row :gutter="16">
            <i-col span='24'>
              <FormItem label="问题描述：">
                <Input v-model="InputItemData.itemDesc" type="textarea" readonly/>
              </FormItem>
            </i-col>
          </Row>
          <Row span='24'>
            <i-col span="24">
              <FormItem label="照片：">
                <div v-show="uploadList.length>0" v-for="item in uploadList" :key='item'
                     style="display: inline-block;margin-right: 10px">
                  <router-link target="_blank" :to="{path:'/imgDetails',query:{id:item.id}}">
                    <img :src="item.picture" alt="" style="width: 50px;height: 50px;">
                  </router-link>
                  <br>
                  <a @click="downloadFile(InputItemData, item)">{{ item.fileName }}</a>
                </div>
              </FormItem>
            </i-col>
          </Row>
          <Row :gutter="16">
            <i-col span='24'>
              <FormItem label='整改措施：'>
                <Input v-model="InputItemData.itemMeasures" type="textarea" readonly/>
              </FormItem>
            </i-col>
          </Row>
          <Row :gutter="16">
            <i-col span='24'>
              <FormItem label='当前进展描述：'>
                <Input v-model="InputItemData.completion" type="textarea" readonly/>
              </FormItem>
            </i-col>
          </Row>
          <Row :gutter="16">
            <i-col span='24'>
              <FormItem label='整改图片：'>
                <div v-show="uploadList2.length>0" v-for="item in uploadList2" :key='item'
                     style="display: inline-block;margin-right: 10px">
                  <router-link target="_blank" :to="{path:'/imgDetails',query:{id:item.id}}">
                    <img :src="item.picture" alt="" style="width: 50px;height: 50px;">
                  </router-link>
                  <br>
                  <a @click="downloadFile(InputItemData, item)">{{ item.fileName }}</a>
                </div>
              </FormItem>
            </i-col>
          </Row>
          <Row :gutter="16">
            <i-col span='24'>
              <FormItem label="整改附件：">
                <div v-show="InputItemData.idFiles.length>0" v-for="(item,index) in InputItemData.idFiles">
                  <a @click="downloadFiles(item,index)"><span
                      style="color: #3399ff;margin-left: 5px">{{ item.fileName }}</span></a>
                  <Progress v-show="uploadListVisible[index]" :percent="uploadListPercent[index]"></Progress>
                </div>
              </FormItem>
            </i-col>
          </Row>
        </Form>
      </div>
      <div slot="footer">
        <Button class='ivu-btn-save' @click="modal6=false">关闭</Button>
      </div>
    </Modal>
    <Modal :transfer=false v-model="modal4" :width=700 :title="addItem?'问题新增':'问题修改'"
           @on-cancel="modal4=false;InputItemData={}">
      <div>
        <Form ref='InputItemData' :model="InputItemData" :rules="ruleCustom1" label-position="top">
          <Div>
            <Row :gutter="16">
              <i-col span='12'>
                <FormItem label='隐患归类：'>
                  <Select v-model="InputItemData.issueCategory" disabled>
                    <Option v-for="item in categoryList" :value="item.codingCodeId" :key="item.codingCodeId">
                      {{ item.codingName }}
                    </Option>
                  </Select>
                </FormItem>
              </i-col>
              <i-col span='12'>
                <FormItem label='隐患等级：'>
                  <Select v-model="InputItemData.issueLevel">
                    <Option v-for="item in levelList" :value="item.codingCodeId" :key="item.codingCodeId">
                      {{ item.codingName }}
                    </Option>
                  </Select>
                </FormItem>
              </i-col>
            </Row>
            <Row :gutter="16">
              <i-col span='12'>
                <FormItem label='隐患类别：'>
                  <Select v-model="InputItemData.issuePosition" v-if="ifCategory == 1">
                    <OptionGroup label="基础管理">
                      <Option v-for="item in basicList" :value="item.codingCodeId"
                              :key="item.codingCodeId">{{ item.codingName }}
                      </Option>
                    </OptionGroup>
                    <OptionGroup label="现场管理">
                      <Option v-for="item in sceneList" :value="item.codingCodeId"
                              :key="item.codingCodeId">{{ item.codingName }}
                      </Option>
                    </OptionGroup>
                  </Select>
                  <Select v-model="InputItemData.issuePosition" v-if="ifCategory == 2">
                    <Option v-for="item in environmentProtectionList" :value="item.codingCodeId"
                            :key="item.codingCodeId">{{ item.codingName }}
                    </Option>
                  </Select>
                </FormItem>
              </i-col>
              <i-col span='12'>
                <FormItem label='检查时间：' prop="rectifyDate">
                  <DatePicker type="date" placeholder="请选择" style="width: 100%;"
                              v-model="InputItemData.checkTime"></DatePicker>
                </FormItem>
              </i-col>
            </Row>
            <Row :gutter="16">
              <i-col span='12'>
                <FormItem label='完成时限：' prop="rectifyDate">
                  <DatePicker type="date" v-model="InputItemData.rectifyDate" :disabled="InputItemData.exist"
                              style="width: 100%"></DatePicker>
                </FormItem>
              </i-col>
              <i-col span='12'>

              </i-col>
            </Row>
            <Row :gutter="16">
              <i-col span='24'>
                <FormItem label="问题描述：">
                  <Input v-model="InputItemData.itemDesc" type="textarea"/>
                </FormItem>
              </i-col>
            </Row>
            <Row :gutter="16">
              <i-col span="24">
                <FormItem label="问题照片：">
                  <div>
                    <Upload ref="upload"
                            :before-upload="beforeUpload"
                            :show-upload-list="true"
                            :max-size="10240"
                            accept="image/jpg, image/jpeg,image/png,image/gif,image/bmp"
                            multiple
                            type="drag"
                            :action="fileUrl">
                      <div style="padding: 10px">
                        <Icon type="ios-cloud-upload" size="45" style="color: #F27874"></Icon>
                        <p>点击将文件拖拽到这里上传</p>
                        <span style="font-size:8px;color: #797a64">支持扩展名：.jpg，jpeg，png 格式的图片</span>
                      </div>
                    </Upload>
                  </div>
                  <div v-show="uploadList.length>0" v-for="item in uploadList" :key='item.id'>
                    <a @click="downloadFile(InputItemData.itemId,item)">{{ item.fileName }}</a>
                    <Button type="text" icon="md-trash" @click="remove1(item.id,InputItemData.itemId)"
                            style="margin-left: 5px;margin-bottom: 3px"/>
                  </div>
                </FormItem>
              </i-col>
            </Row>

          </Div>
        </Form>
      </div>
      <div slot="footer">
        <Button class='ivu-btn-save' @click="submitItem('InputItemData')">确定</Button>
        <Button class='ivu-btn-cancel' @click="modal4=false;InputItemData={}">取消</Button>
      </div>
    </Modal>
    <Modal :transfer=false v-model="modal3" :width=800 title="问题整改">
      <div :style="{height: divHeight, overflowY: 'auto', overflowX: 'hidden'}">
        <Form ref="formCustom2" :model="InputItemData" :rules="ruleCustom2" label-position="top">
          <Row :gutter="16">
            <i-col span='12'>
              <FormItem label="隐患归类：">
                <Select filterable v-model="InputItemData.issueCategory" disabled>
                  <Option v-for="item in categoryList" :value="item.codingCodeId" :key="item.codingCodeId">
                    {{ item.codingName }}
                  </Option>
                </Select>
              </FormItem>
            </i-col>
            <i-col span='12'>
              <FormItem label="隐患等级：">
                <Select filterable v-model="InputItemData.issueLevel" disabled>
                  <Option v-for="item in levelList" :value="item.codingCodeId" :key="item.codingCodeId">
                    {{ item.codingName }}
                  </Option>
                </Select>
              </FormItem>
            </i-col>
          </Row>
          <Row :gutter="16">
            <i-col span='12'>
              <FormItem label="隐患类别：">
                <Select v-model="InputItemData.issuePosition" v-if="ifCategory == 1" disabled>
                  <OptionGroup label="基础管理">
                    <Option v-for="item in basicList" :value="item.codingCodeId" :key="item.codingCodeId">
                      {{ item.codingName }}
                    </Option>
                  </OptionGroup>
                  <OptionGroup label="现场管理">
                    <Option v-for="item in sceneList" :value="item.codingCodeId"
                            :key="item.codingCodeId">{{ item.codingName }}
                    </Option>
                  </OptionGroup>
                </Select>
                <Select v-model="InputItemData.issuePosition" v-if="ifCategory == 2" disabled>
                  <Option v-for="item in environmentProtectionList" :value="item.codingCodeId"
                          :key="item.codingCodeId">{{ item.codingName }}
                  </Option>
                </Select>
              </FormItem>
            </i-col>
            <i-col span='12'>
              <FormItem label='检查时间：'>
                <DatePicker type="date" v-model="InputItemData.checkTime" style="width: 100%"
                            readonly></DatePicker>
              </FormItem>
            </i-col>
          </Row>

          <Row :gutter="16">
            <i-col span='12'>
              <FormItem label='完成时限：'>
                <DatePicker type="date" v-model="InputItemData.rectifyDate" style="width: 100%"
                            readonly></DatePicker>
              </FormItem>
            </i-col>
            <i-col span='12'>
              <FormItem label='整改状态：' prop='state'>
                <Select v-model="InputItemData.state"
                        :disabled="InputItemData.procinstState == '1' || InputItemData.procinstState == '2'">
                  <Option value="NOT_RECTIFIED">待整改</Option>
                  <Option value="START">整改中</Option>
                  <Option value="OPEN">已完成</Option>
                  <Option value="DELAY" disabled>延期</Option>
                </Select>
              </FormItem>
            </i-col>
          </Row>
          <Row :gutter="16">
            <i-col span='24'>
              <FormItem label="问题描述：">
                <Input v-model="InputItemData.itemDesc" type="textarea" readonly/>
              </FormItem>
            </i-col>
          </Row>
          <Row :gutter="16">
            <i-col span="24">
              <FormItem label="问题图片：">
                <div v-show="uploadList.length>0" v-for="item in uploadList" :key='item'
                     style="display: inline-block;margin-right: 10px">
                  <router-link target="_blank" :to="{path:'/imgDetails',query:{id:item.id}}">
                    <img :src="item.picture" alt="" style="width: 50px;height: 50px;">
                  </router-link>
                  <br>
                  <a @click="downloadFile(InputItemData, item)">{{ item.fileName }}</a>
                </div>
              </FormItem>
            </i-col>
          </Row>
          <Row :gutter="16">
            <i-col span='24'>
              <FormItem label='整改措施：' prop="itemMeasures">
                <Input @input="inputRectifyPlan" v-model="InputItemData.itemMeasures" type="textarea"/>
              </FormItem>
            </i-col>
          </Row>
          <Row :gutter="16">
            <i-col span='24'>
              <FormItem label='当前进展描述：' prop="completion">
                <Input v-model="InputItemData.completion" type="textarea"/>
              </FormItem>
            </i-col>
          </Row>
          <Row :gutter="16">
            <i-col span='24'>
              <FormItem label='整改图片：' prop="itemDesc">
                <div>
                  <Upload ref="upload2"
                          :before-upload="beforeUpload2"
                          :show-upload-list="true"
                          :max-size="10240"
                          accept="image/jpg, image/jpeg,image/png,image/gif,image/bmp"
                          multiple
                          type="drag"
                          :action="fileUrl">
                    <div style="padding: 10px">
                      <Icon type="ios-cloud-upload" size="45" style="color: #F27874"></Icon>
                      <p>点击将文件拖拽到这里上传</p>
                      <span style="font-size:8px;color: #797a64">支持扩展名：.jpg，jpeg，png 格式的图片</span>
                    </div>
                  </Upload>
                </div>
                <div v-show="uploadList2.length>0" v-for="item in uploadList2" :key='item.id'>
                  <a @click="downloadFile(InputItemData.itemId,item)">{{ item.fileName }}</a>
                  <Button type="text" icon="md-trash" @click="remove12(item.id,InputItemData.itemId)"
                          style="margin-left: 5px;margin-bottom: 3px"/>
                </div>
              </FormItem>
            </i-col>
          </Row>
          <Row :gutter="16">
            <i-col span='24'>
              <FormItem label="整改附件：">
                <div>
                  <Upload ref="upload"
                          :before-upload="(file) => { beforeUpload1(file, 'id','EnQuestionDetailForApproval') }"
                          :show-upload-list="true"
                          :max-size="10240"
                          multiple
                          type="drag"
                          :action="fileUrl">
                    <div style="padding: 10px">
                      <Icon type="ios-cloud-upload" size="45" style="color: #F27874"></Icon>
                      <p>点击将文件拖拽到这里上传</p>
                      <span style="font-size:8px;color: #797a64">支持扩展名：.rar .zip .doc .docx .pdf...</span>
                    </div>
                  </Upload>
                </div>
                <div v-show="InputItemData.idFiles.length>0" v-for="(item,index) in InputItemData.idFiles"
                     :key='index'>
                  <a @click="downloadFiles(item,index)">{{ item.fileName }}</a>
                  <Button type="text" icon="md-trash"
                          @click="removeFile1(item.id, 'id','EnQuestionDetailForApproval')"
                          style="margin-left: 5px;margin-bottom: 3px"/>
                  <Progress v-show="uploadListVisible[index]" :percent="uploadListPercent[index]"></Progress>
                </div>
              </FormItem>
            </i-col>
          </Row>
        </Form>
      </div>
      <div slot="footer">
        <Button class='ivu-btn-save' :loading="loaingItem" @click="submitItem('formCustom2')">确定</Button>
        <Button class='ivu-btn-cancel' :loading="loaingItem" @click="modal3=false;InputItemData={}">取消</Button>
      </div>
    </Modal>
    <Modal title="图片查看" v-model="visible">
      <img :src="viewUrl" v-if="visible" style="width: 100%">
      <div slot="footer">
        <Button @click="visible=false" class='ivu-btn-save'>关闭</Button>
      </div>
    </Modal>
    <Modal v-model="modal8" width="900" footer-hide title="用户列表">
      <Form :label-width="110" ref="formInline3" >
        <Row :gutter="16" class="query-form2">
          <i-col span="8">
            <FormItem label="用户名称">
              <Input v-model="formInline3.userName" type="text"/>
            </FormItem>
          </i-col>
          <i-col span="8">
            <FormItem label="公司名称：">
              <Input v-model="formInline3.orgName" type="text"/>
            </FormItem>
          </i-col>
          <i-col span="8">
            <div style="float: right;">
              <Button class="ivu-btn-query" icon="md-search" @click="queryUser" style="margin-right: 10px">查询</Button>
              <Button @click="resetUser" class="ivu-btn-reset">重置</Button>
            </div>
          </i-col>
        </Row>
      </Form>
      <Table ref='userTable' height="400" :loading="loading4" no-data-text="请选择查询条件!" border
             :columns="userColumn" width="100%" :data="userInfos" size="small"></Table>
      <Row type="flex" justify="end">
        <i-col>
          <Page :total="pagedata.total2" :current="pagedata.currentPage2" :page-size="pagedata.pageSize2"
                @on-page-size-change="pageSizeChange2" @on-change="pageChange2" :page-size-opts="pageSizeArray"
                show-total show-sizer show-elevator/>
        </i-col>
      </Row>
    </Modal>
    <Modal title="问题延期" :transfer=false v-model="dataToExtensionMod" :width=700 class-name='limit-height-dialog'
           :styles="{height:'400px',top: '100px'}">
      <Form ref="extensionForm" :model="dataToExtension" :rules="extensionShow" class="rpt-form"
            :show-message="false" label-position="top">
        <Row type="flex" justify="space-around" class="code-row-bg">
          <Col span="11">
            <FormItem label="延期时间：" prop="completeTime">
              <DatePicker type="date" placeholder="请选择日期" style="width: 100%"
                          v-model='dataToExtension.completeTime'
                          :editable='false'></DatePicker>
            </FormItem>
          </Col>
          <Col span="11">
            <FormItem label="审批人：" prop="userId">
              <Select v-model="dataToExtension.userId">
                <Option v-for="item in approvers" :value="item.userId"
                        :key="item.userId">{{ item.userName }}
                </Option>
              </Select>
            </FormItem>
          </Col>
        </Row>
        <Row type="flex" justify="space-around" class="code-row-bg">
          <Col span="23">
            <FormItem label='延期说明：' prop='explain'>
              <Input class='' type='textarea' v-model='dataToExtension.explain'></Input>
            </FormItem>
          </Col>
        </Row>

      </Form>
      <div slot="footer">
        <Button type="primary" class='ivu-btn-save' :loading="loadingExtension"
                @click="submitExtension('extensionForm')">确定
        </Button>
        <Button type="primary" class='ivu-btn-cancel' @click="cancel">取消</Button>
      </div>
    </Modal>
    <Modal :transfer=false footer-hide v-model="userMod" :width=900>
      <userManager :model="true" :companyId="-1" @getSelectModelData="getSelectModelData">
      </userManager>
    </Modal>
  </div>
</template>

<script>
import {Api} from '../../../api'
import {sessionStorage} from '@/common/cacheUtils.js';
import userDom from "@/views/safe/hidHazard/searchUser.vue";
import {compressImg} from '@/tools/index'
import userManager from '../../base/authorityManager/userManager'
import _deepclone from 'lodash/cloneDeep'

export default {
  components: {
    userDom, userManager
  },
  data() {
    return {
      imageUrl: Api.interestedPartiesUserFile,
      loaingItem: false,
      loadingExtension: false,
      dataToExtensionMod: false,
      dataToExtension: {},
      uploadListVisible: [],
      uploadListPercent: [],
      divHeight: '',
      addItem: false,
      userMod: false,
      modal6: false,
      modal5: false,
      modal4: false,
      companyId: sessionStorage('userId').getObject('userId').companyId,
      companyName: sessionStorage('userId').getObject('userId').companyName,
      modal3: false,
      buttonloading: false,
      spinShow: true,
      approvers: [],
      bodyHeight: '',
      taskName: '',
      taskInfo: {},
      extensionShow: {
        userId: [{required: true, message: '请选择审批人', trigger: 'change'}],
        explain: [{required: true, message: '请填写延期申请', trigger: 'change'}],
        completeTime: [{
          validator: (rule, value, callback) => {
            if (value == null || value == '' || value == undefined) {
              callback(' ')
            } else {
              callback()
            }
          },
          required: true,
          trigger: 'change'
        }],
      },
      ruleCustom: {
        route: [
          {
            type: 'integer',
            required: true,
            message: '  ',
            trigger: 'blur,change'
          }
        ],
        userName: [
          {
            required: true,
            message: '  ',
            trigger: 'blur,change'
          }
        ],
        dynamicAudits: [
          {
            required: true,
            message: '  ',
            trigger: 'blur,change'
          }
        ]
      },
      ruleCustom1: {},
      ruleCustom2: {
        state: [
          {
            required: true,
            message: '  ',
            trigger: 'blur,change'
          }
        ],
        itemMeasures: [
          {
            required: true,
            message: '  ',
            trigger: 'blur,change'
          }
        ], completion: [
          {
            required: true,
            message: '  ',
            trigger: 'blur,change'
          }
        ]
      },
      formData: {},
      noticeData: {},
      userInfo: {},
      routeList: [
        {
          id: 1,
          name: '同意'
        },
        {
          id: 2,
          name: '不同意'
        }
      ],
      ifRoute: false,
      ifRectificationUser: false,
      ifAcceptanceUser: false,
      ifEdit: false,
      ifRectificationProblems: false,
      ifProblemEdit: false,
      ifCC: false,
      ifCompanyLeader: false,
      approval: false,
      columns3: [
        {
          type: 'index',
          title: '序号',
          width: 80,
          align: 'center',
        },
        {
          minWidth: 120,
          title: '隐患归类',
          align: 'center',
          key: 'issueCategory',
          render: (h, params) => {
            let value = '';
            this.categoryList.forEach(m => {
              if (m.codingCodeId == params.row.issueCategory) {
                value = m.codingName;
              }
            })
            return h('span', value)
          }
        },
        {
          minWidth: 120,
          title: '隐患等级',
          align: 'center',
          key: 'issueLevel',
          render: (h, params) => {
            let value = '';
            this.levelList.forEach(m => {
              if (m.codingCodeId == params.row.issueLevel) {
                value = m.codingName;
              }
            })
            return h('span', value)
          }
        },
        {
          minWidth: 120,
          title: '隐患类别',
          align: 'center',
          key: 'issuePosition',
          render: (h, params) => {
            let value = '';
            if (params.row.issueCategory == 'NOT-00003000000001') {
              this.basicList.forEach(m => {
                if (m.codingCodeId == params.row.issuePosition) {
                  value = m.codingName;
                }
              })
              this.sceneList.forEach(m => {
                if (m.codingCodeId == params.row.issuePosition) {
                  value = m.codingName;
                }
              })
            } else if (params.row.issueCategory == 'NOT-00003000000002') {
              this.environmentProtectionList.forEach(m => {
                if (m.codingCodeId == params.row.issuePosition) {
                  value = m.codingName;
                }
              })
            }
            return h('span', value)
          }
        },
        {
          minWidth: 120,
          title: '检查时间',
          align: 'center',
          key: 'checkTime',
          render: (h, params) => {
            return h('div', [
              h('span', params.row.checkTime ? this.formatDate(new Date(params.row.checkTime), 'yyyy-MM-dd') : '--')
            ]);
          }
        },
        {
          minWidth: 120,
          title: '完成时限',
          align: 'center',
          key: 'rectifyDate',
          render: (h, params) => {
            return h('div', [
              h('span', this.formatDate(new Date(params.row.rectifyDate), 'yyyy-MM-dd') || '--')
            ]);
          }
        },
        {
          minWidth: 150,
          title: '问题描述',
          align: 'center',
          key: 'itemDesc',
          tooltip: true
        },
        {
          minWidth: 150,
          title: '问题图片',
          align: 'center',
          render: (h, params) => {
            let problemList = params.row.problemList;
            let imgs = [];
            if (problemList) {
              problemList.forEach(id => {
                let url = this.imageUrl + "/file/" + id;
                imgs.push(
                    h('img', {
                      style: {
                        width: "30px",
                        margin: "3px",
                        cursor: "pointer"
                      },
                      attrs: {
                        src: url
                      },
                      on: {
                        click: () => {
                          this.handlerView(url)
                        }
                      }
                    })
                )
              })
            }
            return h('div', [...imgs]);
          }
        },
      ],
      viewUrl: '',
      visible: false,
      apsgNoticeItem: [],
      loading1: false,
      fileUrl: Api.interestedPartiesUserFile,
      uploadList: [],
      uploadList2: [],
      index: null,
      InputItemData: {},
      addItem: false,
      userName: '',
      isBeforeUpload: false,
      categoryList: [],
      levelList: [],
      positionList: [],
      variables: {},
      basicList: [],
      sceneList: [],
      environmentProtectionList: [],
      ifCategory: '',
      fileLoading: {
        problemSize: 0,
        measuresSize: 0
      },
      apsgNoticeItem2: [],
      companyLeaderList: [],
      modal8: false,
      formInline3: {},
      userColumn: [
        {
          type: 'index',
          title: '序号',
          width: 80,
          align: 'center',
        },
        {
          minWidth: 180,
          title: '用户名称',
          key: 'userName',
          align: 'center',
        },
        {
          minWidth: 180,
          title: '岗位名称',
          key: 'positionName',
          align: 'center',
        },
        {
          minWidth: 180,
          title: '二级集团',
          key: 'twoLevelOrgName',
          align: 'center',
        },
        {
          minWidth: 180,
          title: '所属公司',
          key: 'companyName',
          align: 'center',
        },
        {
          minWidth: 180,
          title: '所属部门',
          key: 'orgName',
          align: 'center',
        },
        {
          title: '操作',
          align: 'center',
          key: 'view',
          fixed: 'right',
          minWidth: 80,
          render: (h, params) => {
            return h('div', [
              h('A', {
                props: {
                  type: 'primary',
                  size: 'small'
                },
                style: {
                  fontSize: '14px'
                },
                on: {
                  click: () => {
                    this.companyLeaderList.push({userId: params.row.userId, userName: params.row.userName});
                    this.formData.dynamicAudits = params.row.userId;
                    this.modal8 = false;
                  }
                }
              }, '选择')
            ])
          }
        }
      ],
      userInfos: [],
      loading4: false,
      pagedata: {
        total: 0,
        pageSize: 10,
        currentPage: 1,
        total2: 0,
        pageSize2: 10,
        currentPage2: 1
      },
      pageSizeArray: [10, 20, 50],
    }
  },
  watch: {
    "modal3": function (qw, er) {
      if (!qw) {
        this.InputItemData = {};
        this.uploadList2 = [];
        this.uploadList = [];
        this.isBeforeUpload = false;
      }
    },
    "modal4": function (qw, er) {
      if (!qw) {
        this.InputItemData = {};
        this.uploadList = [];
        this.isBeforeUpload = false;
      }
    },
    'fileLoading': {
      handler: function (val) {
        if (val.problemSize == this.apsgNoticeItem2.length && val.measuresSize == this.apsgNoticeItem2.length) {
          this.apsgNoticeItem = this.apsgNoticeItem2;
          this.loading1 = false;
        }
      },
      deep: true
    },
  },
  mounted() {
    this.bodyHeight = window.innerHeight - 175;
    this.taskName = this.$route.query.taskName;
    this.taskInfo = this.$route.query;
    this.userInfo = sessionStorage('userId').getObject('userId');
    if (this.taskInfo.status == 'done' || this.taskInfo.status == 'self') {
      this.approval = false;
      this.addColumns();
    } else
      this.approval = true;
    this.selectCodingSort();
    this.query();
    this.divHeight = window.innerHeight - 150 + 'px';
    this.$http.get(Api.getEnProQuestionAccountApprovers + "/b93eb368d0994a768c0eb84ed5fa794c").then((res) => {
      this.approvers = res.data.data;
    });
  },
  methods: {
    onState(data) {
      switch (data) {
        case "START":
          this.InputItemData.state = 'START';
          this.InputItemData.finishTime = null;
          break;
        case "NOT_RECTIFIED":
          this.InputItemData.state = 'NOT_RECTIFIED';
          this.InputItemData.finishTime = null;
          break;
        case "OPEN":
          this.InputItemData.state = 'OPEN';
          this.InputItemData.finishTime = new Date();
          break;
      }
    },
    inputRectifyPlan(value) {
      if (value && this.InputItemData.state == 'NOT_RECTIFIED') {
        this.InputItemData.state = 'START'
      } else if ((!value) && this.InputItemData.state == 'START') {
        this.InputItemData.state = 'NOT_RECTIFIED'
      }
    },
    getSelectModelData(row) {
      this.dataToExtension.userId = row.userId;
      this.dataToExtension.userName = row.userName;
    },
    cancel() {
      this.dataToExtensionMod = false;
    },
    beforeUpload1(file, filedName, type) {
      let formData = new FormData();
      formData.append("files", file); // 文件对象
      let url = this.fileUrl + '/' + this.InputItemData[filedName] + '/files/' + type
      this.$http.post(url, formData).then((res) => {
        if (res.data.result == "success") {
          this.$Message.info("文件上传成功")
          this.getFiles1(filedName, type);
        }
      })
      return false
    },
    getUser() {
      this.userMod = true;
    },
    removeFile1(id, filedName, type) {
      let url = this.fileUrl + '/file/' + id;
      this.$http.delete(url).then((res) => {
        this.getFiles1(filedName, type)
      })
    },
    async getFiles1(filedName, type) {
      if (this.InputItemData[filedName]) {
        let url = this.fileUrl + '/' + this.InputItemData[filedName] + '/files/' + type.split('/')[0]
        await this.$http.get(url).then((res) => {
          if (res.data.result == "success") {
            this.$set(this.InputItemData, filedName + 'Files', res.data.data)
            let index = 0;
            res.data.data.forEach(item => {
              this.uploadListPercent[index] = 0;
              this.uploadListVisible[index] = false;
              this.uploadListVisible[item.id] = false;
              index++;
            })
          }
        });
      }
    },
    downloadFiles(file, index) {
      let url = this.fileUrl + '/file/' + file.id;
      this.uploadListVisible[index] = true;
      this.uploadListVisible[file.id] = true;
      var _this = this;
      this.$http.get(url, {
        responseType: 'blob',      //告诉服务器我们需要的响应格式
        progress: function (e) {
          _this.$set(_this.uploadListPercent, index, 100 * (e.loaded / e.total));
        }
      }).then((res) => {
        const aLink = document.createElement("a");
        let blob = new Blob([res.data], {
          type: res.bodyBlob.type      //将会被放入到blob中的数组内容的MIME类型
        });
        aLink.href = URL.createObjectURL(blob)
        aLink.download = file.fileName //标题
        aLink.click()
        document.body.appendChild(aLink)
      })
    },
    query() {
      this.loading1 = true;
      this.$http.get(Api.companyRectificationNotice + '/' + this.taskInfo.workId).then(function (response) {
        if (response.data.status == 200) {
          this.noticeData = response.data.data;
          this.$set(this.noticeData, 'inspectionDate', this.formatDate(new Date(this.noticeData.inspectionDate), 'yyyy-MM-dd'));
          this.ifCategory = this.noticeData.noticeCategory;
          let apsgNoticeItem = this.noticeData.apsgNoticeItems;
          if (apsgNoticeItem != undefined) {
            this.apsgNoticeItem = apsgNoticeItem;
          }
          if (this.taskInfo.status == 'done' || this.taskInfo.status == 'self')
            this.spinShow = false;
          else
            this.queryFormList();
        } else {
          this.spinShow = false;

        }
        this.loading1 = false;
      })
    },
    queryFormList() {
      this.$http.get(Api.getProcinstForm + '/' + this.taskInfo.taskId).then(function (response) {
        if (response.data.formList.length != 0) {
          response.data.formList.map((i) => {
            if (i.id == 'route') this.ifRoute = true;
            else if (i.id == 'rectificationUser') this.ifRectificationUser = true;
            else if (i.id == 'acceptanceUser') this.ifAcceptanceUser = true;
            else if (i.id == 'edit') this.ifEdit = true;
            else if (i.id == 'rectificationProblems') this.ifRectificationProblems = true;
            else if (i.id == 'problemEdit') this.ifProblemEdit = true;
            else if (i.id == 'CC') this.ifCC = true;
            else if (i.id == 'companyLeader') {
              this.ifCompanyLeader = true;
              this.$http.get(Api.companyRectificationNotice + '/groupLeader', {params: {orgId: this.noticeData.inspectionUnit}}).then((res) => {
                if (res.data.status == 200) this.companyLeaderList = res.data.data
              })
            }
          });
          this.spinShow = false;
          this.addColumns();
        } else {
          this.spinShow = false;
        }
        this.variables = response.data.variables;
        if (response.data.variables['acceptanceUser'] != undefined) {
          this.$http.get(Api.getUserByUserId + response.data.variables['acceptanceUser']).then(function (res) {
            this.userName = res.data.data.userName;
          });
        }
        this.formData = {
          userName: this.userInfo.userName,
          taskId: this.taskInfo.taskId,
          createUserId: this.userInfo.userId,
          createDateStr: this.formatDate(new Date(), 'yyyy-MM-dd'),
          procinstId: this.taskInfo.procinstId,
        }
      })
    },
    approvalInfo: function () {
      let zgr = false;
      let zgrIndex = '';
      if (this.taskName == '整改人') {
        this.apsgNoticeItem.forEach((i, j) => {
          if (i.itemMeasures == null || i.itemMeasures == '' || i.itemMeasures == undefined) {
            zgrIndex += (j + 1) + '，';
            zgr = true;
          }
        })
      }
      if (zgr) {
        this.$Message.error({
          content: '请检查第' + zgrIndex.substring(0, zgrIndex.length - 1) + '条问题，是否填写整改信息',
          duration: 4
        });
        return;
      }
      if (this.taskName == '整改人') {
        for (let i = 0; i < this.apsgNoticeItem.length; i++) {
          let item = this.apsgNoticeItem[i]
          if (item.state != 'OPEN') {
            this.$Message.error({content: '请先完成整改后提交！', duration: 4});
            return;
          }
        }
      }
      this.sendAcceptorCC();
      this.$refs['formCustom'].validate((valid) => {
        if (valid) {
          this.buttonloading = true;
          if (this.ifEdit == true) this.saveInfo();
          if (this.ifCC) this.CCInfo();
          if(this.taskName == '整改人') this.$set(this.formData, 'acceptanceUser', this.$route.query.reportUserId);
          this.$http.get(Api.taskComplete, {
            params: this.formData
          }).then(function (response) {
            if (response.data.status == 200) {
              this.$Message.success({content: '保存成功', duration: 4});
              this.screenMessage();
              if (this.taskName = '验收人') this.sendAcceptorCC();
              this.returnTo();
            } else {
              this.$Message.error({content: '保存失败', duration: 4});
            }
            this.buttonloading = false;
          });
        } else {
          this.$Message.error({content: '请填写完整！', duration: 4});
        }
      });
    },
    saveInfo() {
      this.noticeData.apsgNoticeItems = this.apsgNoticeItem;
      this.$http.put(Api.companyRectificationNotice, this.noticeData).then(function (response) {
        if (response.data.status != 200) {
          this.$Message.error({content: response.data.msg, duration: 4});
        }
      });
    },
    CCInfo() {
      if (this.formData.route == 1)
        this.$http.get(Api.companyRectificationNotice + '/CCUserIds', {
          params: {
            userId: this.taskInfo.createUserId,
            workId: this.taskInfo.workId,
            createUserId: this.noticeData.createUserId
          }
        });
    },
    submitExtension(name) {
      let _this = this;
      this.$refs[name].validate((valid) => {
        if (valid) {
          _this.loadingExtension = true;
          let url = Api.extensionEnProQuestionAccount;
          this.$http.post(url, _this.dataToExtension).then((res) => {
            if (res.data.status == '200') {
              _this.$Message.success("上报成功")
              _this.getNoticItem();
              _this.dataToExtensionMod = false;
            } else {
              this.$Message.error(res.data.msg);
            }
            _this.loadingExtension = false;
          }).catch(e => {
            console.log(e)
          })
        } else {
          this.$Message.error('请填报完整!');
        }
      })
    },
    returnTo() {
      this.$router.go(-1);
    },
    setUserInfo(data) {
      this.$set(this.formData, 'dynamicAudits', data.userId);
      this.$set(this.formData, 'route', 1);
    },
    addColumns() {
      if (this.ifRectificationProblems) {
        this.columns3.push({
          minWidth: 150,
          title: '整改措施',
          align: 'center',
          key: 'itemMeasures',
          tooltip: true
        });
        this.columns3.push({
          minWidth: 150,
          title: '整改图片',
          align: 'center',
          key: 'itemDesc',
          render: (h, params) => {
            let measuresList = params.row.measuresList;
            let imgs = [];
            if (measuresList) {
              measuresList.forEach(id => {
                let url = this.imageUrl + "/file/" + id;
                imgs.push(
                    h('img', {
                      style: {
                        width: "30px",
                        margin: "3px",
                        cursor: "pointer"
                      },
                      attrs: {
                        src: url
                      },
                      on: {
                        click: () => {
                          this.handlerView(url)
                        }
                      }
                    })
                )
              })
            }
            return h('div', [...imgs]);
          }
        });
        this.columns3.push({
          minWidth: 150,
          title: '当前进展描述',
          align: 'center',
          key: 'completion',
          tooltip: true
        });
        this.columns3.push({
          minWidth: 150,
          title: '完成时间',
          align: 'center',
          key: 'finishTime',
          render: (h, params) => {

            if (!params.row.finishTime) {
              return null;
            }
            return h('div', [
              h('span', this.formatDate(new Date(params.row.finishTime), 'yyyy-MM-dd') || '--')
            ]);
          }

        });
        this.columns3.push({
          title: '操作',
          key: 'action',
          fixed: 'right',
          width: 220,
          align: 'center',
          render: (h, params) => {
            if (this.ifProblemEdit) {
              return h('div', [
                h('A', {
                  props: {
                    type: 'primary',
                    size: 'small'
                  },
                  style: {
                    fontSize: '14px',
                  },
                  on: {
                    click: () => {
                      this.InputItemData = JSON.parse(JSON.stringify(params.row));
                      this.getFiles(params.row.itemId);
                      this.afterDataToViewInit()
                      this.getFiles2(params.row.itemId);
                      this.modal6 = true;
                    }
                  }
                }, '详情')
              ]);
            } else {
              if (this.ifCategory == '2') {
                if (params.row.procinstState == '1' || params.row.procinstState == '2') {
                  return h('div', [
                    h('A', {
                      props: {type: 'primary', size: 'small'},
                      style: {fontSize: '14px', color: '#c5c8ce'}
                    }, '问题延期'),
                    h('Divider', {
                      props: {
                        type: 'vertical',
                      }
                    }, ''),
                    h('A', {
                      props: {
                        type: 'primary',
                        size: 'small'
                      },
                      style: {
                        fontSize: '14px',
                      },
                      on: {
                        click: () => {
                          this.InputItemData = JSON.parse(JSON.stringify(params.row));
                          this.getFiles(params.row.itemId);
                          this.afterDataToViewInit()
                          this.getFiles2(params.row.itemId);
                          this.modal6 = true;
                        }
                      }
                    }, '详情'),
                    h('Divider', {
                      props: {
                        type: 'vertical',
                      }
                    }, ''),
                    h('A', {
                      props: {
                        type: 'primary',
                        size: 'small'
                      },
                      style: {
                        fontSize: '14px',
                      },
                      on: {
                        click: () => {
                          this.InputItemData = JSON.parse(JSON.stringify(params.row));
                          this.getFiles(params.row.itemId);
                          this.getFiles2(params.row.itemId);
                          this.afterDataToViewInit()
                          this.index = params.index;
                          this.modal3 = true;
                          this.addItem = false;
                        }
                      }
                    }, '修改')
                  ]);
                } else {
                  return h('div', [
                    h('A', {
                      props: {
                        type: 'primary',
                        size: 'small'
                      },
                      style: {
                        fontSize: '14px',
                      },
                      on: {
                        click: () => {
                          let dataToExtension = _deepclone(params.row);
                          this.dataToExtension = {
                            completeTime: dataToExtension.completeTime,
                            questionId: dataToExtension.id,
                          };
                          this.dataToExtensionMod = true;
                        }
                      }
                    }, '问题延期'),
                    h('Divider', {
                      props: {
                        type: 'vertical',
                      }
                    }, ''),
                    h('A', {
                      props: {
                        type: 'primary',
                        size: 'small'
                      },
                      style: {
                        fontSize: '14px',
                      },
                      on: {
                        click: () => {
                          this.InputItemData = JSON.parse(JSON.stringify(params.row));
                          this.getFiles(params.row.itemId);
                          this.afterDataToViewInit()
                          this.getFiles2(params.row.itemId);
                          this.modal6 = true;
                        }
                      }
                    }, '详情'),
                    h('Divider', {
                      props: {
                        type: 'vertical',
                      }
                    }, ''),
                    h('A', {
                      props: {
                        type: 'primary',
                        size: 'small'
                      },
                      style: {
                        fontSize: '14px',
                      },
                      on: {
                        click: () => {
                          this.InputItemData = JSON.parse(JSON.stringify(params.row));
                          this.getFiles(params.row.itemId);
                          this.getFiles2(params.row.itemId);
                          this.afterDataToViewInit()
                          this.index = params.index;
                          this.modal3 = true;
                          this.addItem = false;
                        }
                      }
                    }, '修改')
                  ]);
                }
              } else {
                return h('div', [
                  h('A', {
                    props: {
                      type: 'primary',
                      size: 'small'
                    },
                    style: {
                      fontSize: '14px',
                    },
                    on: {
                      click: () => {
                        this.InputItemData = JSON.parse(JSON.stringify(params.row));
                        this.getFiles(params.row.itemId);
                        this.afterDataToViewInit()
                        this.getFiles2(params.row.itemId);
                        this.modal6 = true;
                      }
                    }
                  }, '详情'),
                  h('Divider', {
                    props: {
                      type: 'vertical',
                    }
                  }, ''),
                  h('A', {
                    props: {
                      type: 'primary',
                      size: 'small'
                    },
                    style: {
                      fontSize: '14px',
                    },
                    on: {
                      click: () => {
                        this.InputItemData = JSON.parse(JSON.stringify(params.row));
                        this.getFiles(params.row.itemId);
                        this.getFiles2(params.row.itemId);
                        this.afterDataToViewInit()
                        this.index = params.index;
                        this.modal3 = true;
                        this.addItem = false;
                      }
                    }
                  }, '修改')
                ]);

              }


            }
          }
        });
      } else {
        this.columns3.push({
          title: '操作',
          key: 'action',
          fixed: 'right',
          width: 200,
          align: 'center',
          render: (h, params) => {
            if (this.ifEdit == true) {
              return h('div', [
                h('A', {
                  props: {
                    type: 'primary',
                    size: 'small'
                  },
                  style: {
                    fontSize: '14px',
                  },
                  on: {
                    click: () => {
                      this.InputItemData = JSON.parse(JSON.stringify(params.row));
                      this.getFiles(params.row.itemId);
                      this.afterDataToViewInit()
                      this.getFiles2(params.row.itemId);
                      this.modal5 = true;
                    }
                  }
                }, '详情'),
                h('Divider', {
                  props: {
                    type: 'vertical',
                  }
                }, ''),
                h('A', {
                  props: {
                    type: 'primary',
                    size: 'small'
                  },
                  style: {
                    fontSize: '14px',
                  },
                  on: {
                    click: () => {
                      this.InputItemData = JSON.parse(JSON.stringify(params.row));
                      this.getFiles(params.row.itemId);
                      this.index = params.index;
                      this.modal4 = true;
                      this.addItem = false;
                    }
                  }
                }, '修改'),
                h('Divider', {
                  props: {
                    type: 'vertical',
                  }
                }, ''),
                h('A', {
                  props: {
                    type: 'error',
                    size: 'small'
                  },
                  style: {
                    fontSize: '14px',
                    color: 'red',
                  },
                  on: {
                    click: () => {
                      this.$Modal.confirm({
                        title: '数据删除',
                        content: '<p>确定删除该条信息</p>',
                        okText: '确认',
                        onOk: () => {
                          this.apsgNoticeItem.splice(params.index, 1);
                        },
                        cancelText: '取消'
                      });
                    }
                  }
                }, '删除'),
              ]);
            } else {
              return h('div', [
                h('A', {
                  props: {
                    type: 'primary',
                    size: 'small'
                  },
                  style: {
                    fontSize: '14px',
                  },
                  on: {
                    click: () => {
                      this.InputItemData = JSON.parse(JSON.stringify(params.row));
                      this.getFiles(params.row.itemId);
                      this.afterDataToViewInit()
                      this.getFiles2(params.row.itemId);
                      this.modal5 = true;
                    }
                  }
                }, '详情'),
              ]);
            }
          }
        });
      }
      if (this.taskInfo.status == 'done' || this.taskInfo.status == 'self') {
        this.columns3.push({
          minWidth: 150,
          title: '整改措施',
          align: 'center',
          key: 'itemMeasures',
          tooltip: true
        });
        this.columns3.push({
          minWidth: 150,
          title: '整改图片',
          align: 'center',
          key: 'itemDesc',
          render: (h, params) => {
            let measuresList = params.row.measuresList;
            let imgs = [];
            if (measuresList) {
              measuresList.forEach(id => {
                let url = this.imageUrl + "/file/" + id;
                imgs.push(
                    h('img', {
                      style: {
                        width: "30px",
                        margin: "3px",
                        cursor: "pointer"
                      },
                      attrs: {
                        src: url
                      },
                      on: {
                        click: () => {
                          this.handlerView(url)
                        }
                      }
                    })
                )
              })
            }
            return h('div', [...imgs]);
          }
        });
      }
    },
    getFiles(id) {
      let url = this.fileUrl + '/' + id + '/files/picture';
      this.$http.get(url, {params: {field: 'problem'}}).then((res) => {
        if (res.data.result == "success") {
          this.uploadList = res.data.data;
          if (this.isBeforeUpload) {
            this.InputItemData.files = res.data.data;
          }
        }
      })
    },
    finish(data) {
      this.$http.get(Api.finishEnProQuestionAccount + data.id).then((res) => {
        if (res.data.status == '200') {
          this.getNoticItem();
          this.$Message.success('修改成功');
        } else {
          this.$Message.error('失败');
        }
      }).catch(e => {
        console.log(e);
      })
    },
    async afterDataToViewInit() {
      await this.getFiles1('id', 'EnQuestionDetailForApproval');
    },
    getFiles2(id) {
      let url = this.fileUrl + '/' + id + '/files/picture';
      this.$http.get(url, {params: {field: 'measures'}}).then((res) => {
        if (res.data.result == "success") {
          this.uploadList2 = res.data.data;
          if (this.isBeforeUpload) {
            this.InputItemData.files2 = res.data.data;
          }
        }
      })
    },
    downloadFile(guideId, file) {
      let url = this.fileUrl + '/file/' + file.id;
      this.$http.get(url, {
        responseType: 'blob'      //告诉服务器我们需要的响应格式
      }).then((res) => {
        const aLink = document.createElement("a");
        let blob = new Blob([res.data], {
          type: res.bodyBlob.type      //将会被放入到blob中的数组内容的MIME类型
        });
        aLink.href = URL.createObjectURL(blob)
        aLink.download = file.fileName //标题
        aLink.click()
        document.body.appendChild(aLink)
      })
    },
    async beforeUpload(file) {
      let index = file.name.lastIndexOf(".");
      let suffix = file.name.substr(index + 1);
      if (suffix != 'jpg' && suffix != 'jpeg' && suffix != 'png') {
        this.$Message.error("请上传jpg,jpeg,png格式的图片");
        this.file = null;
        this.fileName = null;
      } else {
        let formData = new FormData();
        let compressFile = await compressImg(file)
        formData.append("files", compressFile); // 文件对象
        let url = this.fileUrl + '/' + this.InputItemData.itemId + '/files/picture/problem';
        this.$http.post(url, formData).then((res) => {
          if (res.data.result == "success") {
            this.$Message.info("文件上传成功");
            this.isBeforeUpload = true;
            this.getFiles(this.InputItemData.itemId);
          }
        })
      }
      return false;
    },
    async beforeUpload2(file) {
      let index = file.name.lastIndexOf(".");
      let suffix = file.name.substr(index + 1);
      if (suffix != 'jpg' && suffix != 'jpeg' && suffix != 'png') {
        this.$Message.error("请上传jpg,jpeg,png格式的图片");
        this.file = null;
        this.fileName = null;
      } else {
        let formData = new FormData();
        let compressFile = await compressImg(file)
        formData.append("files", compressFile); // 文件对象
        let url = this.fileUrl + '/' + this.InputItemData.itemId + '/files/picture/measures';
        this.$http.post(url, formData).then((res) => {
          if (res.data.result == "success") {
            this.$Message.info("文件上传成功")
            this.isBeforeUpload = true;
            this.getFiles2(this.InputItemData.itemId);
          }
        })
      }
      return false;
    },
    handlerView(url) {
      this.viewUrl = url;
      this.visible = true;
    },
    remove1(id, itemId) {
      let url = this.fileUrl + '/file/' + id;
      this.$http.delete(url).then((res) => {
        this.getFiles(itemId)
      })
    },
    remove12(id, itemId) {
      let url = this.fileUrl + '/file/' + id;
      this.$http.delete(url).then((res) => {
        this.getFiles2(itemId)
      })
    },
    addItemInfo() {
      this.addItem = true;
      this.uploadList = [];
      this.InputItemData = {
        issueCategory: this.ifCategory == 1 ? 'NOT-00003000000001' : 'NOT-00003000000002',
        checkTime: this.noticeData.inspectionDate,
        itemId: this.uuid(),
        files: [],
      };
      this.modal4 = true
    },
    getNoticItem() {
      let _this = this;
      this.loading1 = true;
      this.$http.get(Api.getNoticItem + this.taskInfo.workId).then(function (response) {
        if (response.data.status == 200) {
          let apsgNoticeItem = response.data.data
          _this.$set(_this.noticeData, 'apsgNoticeItems', response.data.data)
          _this.apsgNoticeItem = apsgNoticeItem;

        }
        _this.loading1 = false;
      }).catch(e => {
        _this.loading1 = false;
      })
    },
    submitItem(name) {
      let _this = this;
      this.$refs[name].validate((valid) => {
        if (valid) {
          if (this.addItem) {
            this.apsgNoticeItem.push(this.InputItemData);
            this.modal4 = false;
          } else {
            if (this.taskName == '整改人') {
              _this.loaingItem = true;

              _this.apsgNoticeItem[_this.index] = this.InputItemData;
              this.$http.put(Api.companyRectificationNotice + '/item', this.InputItemData).then(function (response) {
                _this.getNoticItem();
                _this.loaingItem = false;
                _this.modal3 = false;
              });
            } else {
              this.$set(_this.apsgNoticeItem, _this.index, _this.InputItemData)
              if (name == 'formCustom2') _this.modal3 = false;
              else _this.modal4 = false;
            }
          }
        } else {
          this.$Message.error('请填报完整!');
        }
      })
    },
    selectCodingSort() {
      this.$http.get(Api.queryCodeDetailBySortId + '/NOT-00003', {params: {}}).then((res) => {
        this.categoryList = res.data.data;
      });
      this.$http.get(Api.queryCodeDetailBySortId + '/NOT-00001', {params: {}}).then((res) => {
        this.levelList = res.data.data;
      });
      this.$http.get(Api.queryCodeDetailBySortId + '/NOT-00002', {params: {}}).then((res) => {
        this.positionList = res.data.data;
      });
      this.$http.get(Api.queryCodeDetailBySuperiorcode + '/NOT-00007000000001', {params: {}}).then((res) => {
        this.basicList = res.data.data;
      });
      this.$http.get(Api.queryCodeDetailBySuperiorcode + '/NOT-00007000000004', {params: {}}).then((res) => {
        this.sceneList = res.data.data;
      });
      this.$http.get(Api.queryCodeDetailBySortId + '/NOT-00006', {params: {}}).then((res) => {
        this.environmentProtectionList = res.data.data;
      });
    },
    formatDate(date, fmt) {
      if (/(y+)/.test(fmt)) {
        fmt = fmt.replace(RegExp.$1, (date.getFullYear() + '').substr(4 - RegExp.$1.length));
      }
      let o = {
        'M+': date.getMonth() + 1,
        'd+': date.getDate(),
        'h+': date.getHours(),
        'm+': date.getMinutes(),
        's+': date.getSeconds()
      };
      for (let k in o) {
        if (new RegExp(`(${k})`).test(fmt)) {
          let str = o[k] + '';
          fmt = fmt.replace(RegExp.$1, RegExp.$1.length === 1 ? str : this.padLeftZero(str));
        }
      }
      return fmt;
    },
    padLeftZero(str) {
      return ('00' + str).substr(str.length);
    },
    uuid() {
      let s = [];
      let hexDigits = "0123456789abcdef";
      for (let i = 0; i < 32; i++) {
        s[i] = hexDigits.substr(Math.floor(Math.random() * 0x10), 1);
      }
      s[14] = "4"; // bits 12-15 of the time_hi_and_version field to 0010
      s[19] = hexDigits.substr((s[19] & 0x3) | 0x8, 1); // bits 6-7 of the clock_seq_hi_and_reserved to 01
      let uuid = s.join("");
      return uuid
    },
    screenMessage() {
      if (this.taskName == '集团负责人') {
        if (this.formData.route == 1) {
          this.sendMessage(this.variables['companyLeader']);
        } else {
          this.sendMessage(this.variables['reportUser']);
        }
      } else if (this.taskName == '企业负责人') {
        this.sendMessage(this.formData.dynamicAudits);
      } else if (this.taskName == '整改人') {
        let userId = this.formData.dynamicAudits == undefined ? this.variables['acceptanceUser'] : this.formData.dynamicAudits;
        this.sendMessage(userId);
      } else if (this.taskName == '验收人') {
        if (this.formData.route == 2) {
          this.sendMessage(this.variables['rectificationUser']);
        }
      } else if (this.taskName == '填报人') {
        this.sendMessage(this.variables['groupLeader']);
      }
    },
    sendMessage(userId) {
      let data = {userId: userId, content: "您有一条隐患整改通知单要审批，请登录安全环保信息平台进行审批"};
      this.$http.post(Api.sendMessage, data);
    },
    changeCategory(id) {
      this.$set(this.InputItemData, 'issuePosition', null);
      this.ifCategory = id
    },
    sendAcceptorCC() {
      if (this.noticeData.noticeType == 1 || this.noticeData.noticeType == null) {
        if (this.noticeData.companyId == '18000000') {
          let data = {
            roleId: '6fc61bc57cb043e6929ce54d43515099',
            org: '18000000',
            fromPage: 1,
            pageSize: 100
          }
          this.$http.get(Api.queryUserInRole, {params: data}).then(res => {
            if (res.data.data != null && res.data.data.length != 0) {
              //抄送给验收管理员角色
              this.$http.get(Api.companyRectificationNotice + '/CCUserIds', {
                params: {
                  userId: res.data.data[0]['userId'],
                  workId: this.taskInfo.workId,
                  createUserId: '8ad810e24f39585c014f395aae380000',
                  content: '已有一条隐患整改通知单待验收完毕，请查看！'
                }
              });
              //发送短信
              this.$http.post(Api.sendMessage, {userId: res.data.data[0]['userId'], content: "已有一条隐患整改通知单待验收完毕，请查看"});
            }
          })
        }
      }
    },
    openUserModal() {
      this.modal8 = true;
      this.queryUser();
    },
    queryUser() {
      let companyId = this.noticeData.inspectionUnit;

      let data = {
        fromPage: this.pagedata.currentPage,
        pageSize: this.pagedata.pageSize,
        companyId: companyId
      };
      data = Object.assign(data, JSON.parse(JSON.stringify(this.formInline3)));
      this.loading4 = true;
      this.$http.get(Api.queryUser, {
        params: data
      }).then(res => {
        res.data.data.map(i => {
          i.orgName = i.orgInfo.orgName;
          i.orgId = i.orgInfo.orgId;
          if (i.position != null) {
            i.positionId = i.position.positionId
            i.positionName = i.position.positionName
          }
        })
        this.userInfos = res.data.data;
        this.pagedata.total2 = res.data.total;
        this.loading4 = false;
      }).catch(e => {
        this.loading4 = false;
        this.$Message.error('请求失败');
      })
    },
    pageSizeChange2(pageSize) {
      this.pagedata.pageSize2 = pageSize;
      this.queryUser();
    },
    pageChange2(pageNum) {
      this.pagedata.currentPage2 = pageNum;
      this.queryUser();
    },
    resetUser() {
      this.formInline3 = {}
      this.queryUser();
    },
    changeRoute(val) {
      if (this.taskName == '二级集团负责人') {
        if (val == "1") {
          this.ifCompanyLeader = true;
        } else {
          this.ifCompanyLeader = false;
        }
      }
    }
  }
}
</script>

<style scoped>
.demo-spin-icon-load {
  animation: ani-demo-spin 1s linear infinite;
}
</style>
